<template>
    <div class="main1">
        <!--<x-header title="选择被检查单位"></x-header>-->
        <div class="tree-menu">
            <ul class="showul"
                v-for="(menuItem,index) in theModel"
                :key="index">
                <my-tree :model="menuItem"></my-tree>
            </ul>
        </div>

    </div>

</template>

<script>
//  import testData from './testdata';
import myTree from './treemenu'
import { XHeader, Tabbar, TabbarItem, Group, Cell } from 'vux'
export default {
    name: 'App',
    data () {
        return {
            theModel: [],
            userId: '',
            tokenId: '',
            projectId: '',
            userInfo: ''
        }
    },
    components: {
        Tabbar,
        TabbarItem,
        Group,
        Cell,
        XHeader,
        myTree
    },
    created () {
        this.userInfo = JSON.parse(localStorage.userInfo)
        this.userId = this.userInfo.userid
        this.tokenId = this.userInfo.tokenId
        this.projectId = this.userInfo.deptid
        this.getCompany()
    },
    watch: {
        deptid (newVal) {
            console.log(newVal)
        }
    },
    methods: {
        getCompany () {
            // let xhr = new XMLHttpRequest();
            // xhr.open("post","/nzcgjsms/api/AppService.ashx");

            // xhr.send({"data":{"allowPaging": true,"business": "GetHdProjects","data": "393498467","pageIndex": 0,"pageSize": 20,"tokenId": "BECC40369A4E48CBD726FED2AE61CDDA","userId": "-1160409415"}});

            // xhr.onreadystatechange = function(){
            //     if(xhr==200){
            //        console.log(xhr.response)
            //     }
            // }
            let param = {
                'allowPaging': true,
                'business': 'GetDeparts',
                'data': {
                    'deptId': this.userInfo.departsir == 2 ? this.userInfo.pdeptid : this.userInfo.deptid
                },
                'pageIndex': 0,
                'pageSize': 20,
                'tokenId': this.tokenId,
                'userId': this.userId
            }
            this.$axiosAjax.getConfigJson(
                param
            ).then(
                (res) => {
                    this.theModel = [this.totree(res.data.data)]
                }
            )
        },
        totree (list) {
            let id,
                deptName
            // list.forEach(
            //     (item)=>{
            //     if(item.type==1){
            //             id = item.deptId;
            //             deptName = item.deptName
            //     }
            //     }
            // )
            for (var i = 0; i < list.length; i++) {
                if (list[i].type == 1) {
                    id = list[i].deptId
                    deptName = list[i].deptName
                    break
                }
                if (list[i].type == 2) {
                    id = list[i].deptId
                    deptName = list[i].deptName
                    break
                }
            }
            let root = null
            if (list && list.length) {
                root = { deptId: id, parentId: null, deptName: deptName, children: [] }
                const group = {}
                for (let index = 0; index < list.length; index += 1) {
                    if (list[index].parentId !== null && list[index].parentId !== undefined) {
                        if (!group[list[index].parentId]) {
                            group[list[index].parentId] = []
                        }
                        group[list[index].parentId].push(list[index])
                    }
                }
                const queue = []
                queue.push(root)
                while (queue.length) {
                    const node = queue.shift()
                    node.children = group[node.deptId] && group[node.deptId].length ? group[node.deptId] : null
                    if (node.children) {
                        queue.push(...node.children)
                    }
                }
            }
            return root
        }
    }

}
</script>

<style scoped lang="less">
.main1 {
    background-color: #fff;
}
</style>
